<%@ taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

<script type="text/javascript">
	$(function() {
		$( "#tabs" ).tabs();
	});
</script>

<h1>User Register</h1>

<div class="demo">
	<div id="tabs">
		<ul>
			<li><a href="#tabs-1">Login</a></li>
		</ul>
		<div id="tabs-1">
			<p>
				<c:url var="usersUrl" value="/users/register"/>
				<form:form modelAttribute="user" action="${usersUrl}" method="post" >
				    <spring:hasBindErrors name="user">
							<div class="error">
								<spring:bind path="user.*">
									<c:forEach items="${status.errorMessages}" var="error">
										<span><c:out value="${error}"/></span><br>
									</c:forEach>
								</spring:bind>
							</div>
					</spring:hasBindErrors>
						<p>			
							<label for="userName">User Name:</label><br/>
							<form:input id="userName" path="userName" cssStyle="width:150px"/><br/>
						</p>	
						<p>		
							<label for="loginName">Login Name:</label><br/>
							<form:input id="loginName" path="loginName" cssStyle="width:150px"/><br/>
						</p>	
						<p>		
							<label for="password">Password:</label><br/>
							<form:password id="password" path="password" cssStyle="width:150px"/><br/>
						</p>	
						<p>	
							<label for="password2">confirm password:</label><br/>
							<input type="password" id="password2" style="width:150px"/><br/>
							<script type="text/javascript">
				
								function confirmPassword(value, constraints) {
									var isValid = false;
									if(constraints && constraints.other) {
										var otherInput = dijit.byId(constraints.other);
										if(otherInput) {
											var otherValue = otherInput.value;
											isValid = (value == otherValue);
										}
									}
									return isValid;
								}
								
							</script>
						</p>
						<p>
							<button id="proceed" type="submit">OK</button>
						</p>		
				</form:form>
			</p>
		</div>
	</div>
</div>



